﻿$(document).ready(function () {

    //Set height
    $(".SummaryVertical").each(function () {
        currentWeek = $(this).children().first('.location');
        var liSize = currentWeek.find('.rb-week').children().length;
        var liHeight = currentWeek.find('.rb-week').children('li:eq(0)').outerHeight(true);
        var dayHeight = currentWeek.find('.rb-today').outerHeight(true);
        var maxWeekHeight = (liSize * liHeight);
        var nextPrevHeight = $(this).find('.prev').outerHeight(true);
        var maxLocationHeight = (dayHeight + maxWeekHeight + nextPrevHeight + nextPrevHeight);
        $(this).height(maxLocationHeight + 10);
    });


    $('.next').click(function () {
        var currentWeek = $(this).parent();
        currentWeek.parent().find('.location').first().insertAfter(currentWeek);
    });

    $('.prev').click(function () {
        var currentWeek = $(this).parent();
        currentWeek.insertBefore(currentWeek.parent().find('.location').first());
    });


    $('.rb-today').click(function () {
        var displayType = $(this).parent().parent("#MetroWeatherForcast").attr("class");
        var currentWeek = $(this).parent("div.location");
        var liSize = $(this).next('.rb-week').children().length;

        var liWidth = $(this).next('.rb-week').children('li:eq(0)').outerWidth(true);
        var dayWidth = $(this).outerWidth(true);
        var maxWeekWidth = (liSize * liWidth);
        var maxLocationWidth = (dayWidth + maxWeekWidth);

        var liHeight = $(this).next('.rb-week').children('li:eq(0)').outerHeight(true);
        var dayHeight = $(this).outerHeight(true);
        var maxWeekHeight = (liSize * liHeight);
        var maxLocationHeight = (dayHeight + maxWeekHeight);


        if (currentWeek.hasClass("open")) {
            currentWeek.toggleClass("open");
            if (displayType == "Vertical") {
                $(this).next('ul.rb-week').animate({ top: -maxWeekHeight }, function () {
                    currentWeek.animate({ height: dayHeight }, 500);
                });
            }
            if (displayType == "Horizontal") {
                $(this).next('ul.rb-week').animate({ left: -maxWeekWidth }, function () {
                    currentWeek.animate({ width: dayWidth }, 500);
                });
            }
        }
        else {
            currentWeek.toggleClass("open");
            if (displayType == "Vertical") {
                currentWeek.animate({ height: maxLocationHeight }, function () {
                    $(this).find('ul.rb-week').animate({ top: 0 }, 500);
                });
            }
            if (displayType == "Horizontal") {
                currentWeek.animate({ width: maxLocationWidth }, function () {
                    $(this).find('ul.rb-week').animate({ left: 0 }, 500);
                });

            }
        }
    });
});